//查询方法
function query(data) {
    //成功即调用
    if(data.code==="100"){
        //获取tbody
        let slideList=$("#slideList");
        //删除tboty被选元素的所有子节点（不包括被选元素）
        slideList.empty();
        //for循环 遍历整个数组存储 i；
        for(let i=0;i<data.info.list.length;i++){
            // region

            //一个i代表一个位置；
            let slideDemo=data.info.list[i];
            //创建tr
            let tr=$("<tr></tr>");
            //创建td
            let td=$("<td></td>");
            //给td添加css属性与值
            td.css("text-align","center");
            //存储每个位置的id；
            let idDemo=slideDemo;
            //设置属性
            tr.attr(idDemo);
            //给td文本赋值
            td.text(idDemo.bannerId);
            //给td添加class类名
            td.addClass("bannerId");
            //在tr中插入td
            tr.append(td);
            //endregion

// region
            td=$("<td></td>");
            td.css("text-align","center");
            td.text(slideDemo.bannerName); //设置td的属性值
            tr.append(td);
 //endregion
// region
            td=$("<td></td>");
            td.css("text-align","center");
            td.text(slideDemo.bannerLink);//设置td的属性值
            tr.append(td);
//endregion
// region
            td=$("<td></td>");
            td.css("text-align","center");
            td.css("height","170px");
            let img =$("<img></img>");  //创建img
            img.attr("src",slideDemo.bannerPicture);//设置img scr的属性值
            img.addClass("image");
            td.append(img);
            tr.append(td);
//endregion
// region
            td=$("<td></td>");
            let btn=$("<button></button>");
            btn.addClass("change");
            btn.text("修改");
            $(btn).click(function (e) {
                //点击修改打开弹出框
                $("#changeCover").fadeIn(300);
                //找到修改按钮的父元素 td的上一个兄弟元素里的img的属性Src
                let imgTd=$(this).parent().prev().find("img").attr("src");
                //找到按钮的父元素tr的子元素td中的第三个td里的文本内容
                let linkTd=$(this).parents("tr").children(":nth-child(3)").text();
                //找到按钮的父元素tr的子元素td中的第二个td里的文本内容
                let titleTd=$(this).parents("tr").children(":nth-child(2)").text();
                //找到按钮的父元素tr的子元素td中的第一个td里的文本内容
                let id=$(this).parents("tr").children(":nth-child(1)").text();
                //给弹出框id赋值
               $("#changeCover #bannerId").val(id);
                //给弹出框标题赋值
                $("#changeCover .bannerName").val(titleTd);
                //给弹出框链接赋值
                $("#changeCover .bannerLink").val(linkTd);
                //给弹出框图片赋值
                $("#changeCover .bannerPicture").val(imgTd);
            });
            //endregion
// region

            //插入按钮
            td.append(btn);
            btn=$("<button></button>");
            btn.addClass("delete");
            btn.text("删除");
            $(btn).click(function (e) {
                //找到按钮的父元素tr
                let td=$(this).parent();
                //获取bannerId的文本
                let id= tr.children(".bannerId").text();
                $.ajax({
                    //链接
                    url:'http://192.168.1.118/qa/banner/deleteBanner',
                    //请求方法
                    type:"POST",
                    //数据
                    data:{
                        //参数
                        bannerId:id
                    },
                    //数据类型
                    dataType:'json',
                    //同步还是异步
                    async:true,
                    //成功方法
                    success:function (data) {
                        if(data.code==="100"){
                            alert("你确定要删除“"+ id +"”吗");
                            //删除被选元素的父元素
                                td.parent().remove();

                        }else{
                            alert(data.msg);
                        }
                    },
                    // error:function (res) {
                    //     console.log(res);
                    // }
                });
            });
            //endregion
// region

            td.append(btn);
            btn=$("<button></button>");
            btn.addClass("moveUp");
            let top=$("<i></i>");
            top.addClass("iconfont icon-shangjiantou");
            btn.append(top);
            $(btn).click(function (e) {
                //获取tr
                    let row = $(this).parent().parent();
                    //获取tr的上一个兄弟元素
                    let pre = row.prev();
                    //如果所有tr的长度大于0
                    if ( pre.length > 0) {
                        //在他之前插入tr
                        row.insertBefore(pre);
                    }

            });
            //endregion
// region

            td.append(btn);
            btn=$("<button></button>");
            btn.addClass("moveDown");
            let down=$("<i></i>");
            down.addClass("iconfont icon-xia");
            btn.append(down);
            $(btn).click(function (obj) {
                let row = $(this).parent().parent();
                //获取tr的下一个兄弟元素
                let next = row.next();
                if ( next.length > 0) {
                    row.insertAfter(next);
                }
            });
            //endregion
            td.append(btn);
            tr.append(td);
            //表单插入tr；td自动插入
            slideList.append(tr);
            // slideList.append(td);
        }
    }else{
        alert(data.msg)
    }


}
//ajax包装刷新方法
function ajaxDefrence(){
    $.ajax({
        url: 'http://192.168.1.118/qa/banner/list',
        type: "POST",
        data: {

        },
        dataType: 'json',
        async: true,
        success: function (data) {
            query(data);
        },
    });
}
ajaxDefrence();